<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
      layout:decorator="layout">
<head>
    <title>118,我给母校发红包</title>
</head>
<body>
<section layout:fragment="content">
    <div class="main">
        <div class="logo">
            <img src="../static/img/logo1.png" th:src="@{/static/img/logo1.png}"/>
        </div>
        <ul class="ui-row op">
            <li class="ui-col ui-col-50 " th:if="${user.type} eq -1">
                <label><input type="radio"  name="userType" checked="checked" value="0" class="userType" />校友</label>
            </li>
            <li class="ui-col ui-col-50" th:if="${user.type} eq -1">
                <label><input type="radio"  name="userType" value="1" class="userType" />北大之友</label>
            </li>
            <li class="ui-col ui-col-50 " th:if="${user.type} eq 0">
                <label><input type="radio"  name="userType" checked="checked" readonly="true" value="0" class="userType" />校友</label>
            </li>
            <li class="ui-col ui-col-50" th:if="${user.type} eq 1">
                <label><input type="radio"  name="userType" value="0" readonly="true"  class="userType" />校友</label>
            </li>
            <li class="ui-col ui-col-50" th:if="${user.type} eq 0">
                <label><input type="radio"  name="userType" value="1" readonly="true"  class="userType" />北大之友</label>
            </li>
            <li class="ui-col ui-col-50" th:if="${user.type} eq 1">
                <label><input type="radio"  name="userType" value="1" readonly="true"  checked="checked" class="userType" />北大之友</label>
            </li>

        </ul>
    </div>
    <div class="bgf redcard-money size30">
        <div class="money-tips width90 margin0auto">
            我要发
            <ul class="ui-tiled">
                <li><div class="active uNum">10个</div></li>
                <li><div class="uNum">20个</div></li>
                <li><div class="uNum">100个</div></li>
            </ul>
            <p class="tag clear">*每个红包1.18元</p>
            <div class="write-money">
                <div class="even">
                    自定义
                    <div class="write-inp"><input class="definedNum" type="tel"  placeholder="请输入" /> 个</div>
                </div>
                <p class="clear money-count">合计 <span class="bth9b uPay">11.80</span> 元</p>
                <p class="tag clear">红包里的每一分钱都将注入北京大学校友基金</p>
            </div>
        </div>
    </div>
    <div class="bgf">
        <div class="width90 margin0auto even" th:if="${user.realName} eq '' or ${user.realName} eq null">
            <span class="bth9b">*</span>姓名<div class="write-inp"><input type="text" class="uName" placeholder="请输入姓名" /></div>
        </div>
        <div class="width90 margin0auto even" th:unless="${user.realName} eq '' or ${user.realName} eq null">
            <span class="bth9b">*</span>姓名<div class="write-inp"><input type="text" class="uName" placeholder="请输入姓名" th:value="${user.realName}" readonly="true"/></div>
        </div>
    </div>

    <div id="fhb" class="rbtn give-redcard">发红包</div>
    <script type="text/javascript" src="js/lib/zeptojs/zepto.min.js" th:src="@{/static/js/lib/zeptojs/zepto.min.js}"></script>
    <script>
        $(function(){
            var $fhb = $("#fhb"), //发红包按钮
                    $definedNum = $(".definedNum"), //自定义个数
                    $uNum = $(".uNum"), //所选择的几个红包
                    $uPay = $(".uPay"), //合计
                    $uName = $(".uName"),//姓名
                    uMoney = 1.18; //每个红包1。18元
            $uNum.on("click",function(){
                $uNum.removeClass("active");
                $(this).addClass("active");
                var _v = parseInt($(this).text()).toFixed(0);
                $uPay.text((_v * uMoney).toFixed(2));
                $definedNum.val("")
            })
            $definedNum.on("keyup",function(){
                var _v = parseInt($(this).val());
                if(_v>0){
                    $uNum.removeClass("active");
                    $(this).val(_v);
                    $uPay.text((_v * uMoney).toFixed(2));
                }else{

                }
            }).on("blur",function(){
                if(0 >= $(this).val()){
                    $(this).val(1);
                }
            })
            $fhb.on("click",function(){
                var _uType = parseInt($(".userType:checked").val());
                var _uNum = parseInt(parseFloat($uPay.text()) / uMoney);
                var _uName = $uName.val();
                var data = {'uType':_uType,'type':0,'share':_uNum,'realName':_uName,'amount':uMoney};
                if(_uName != ""){
                    $.ajax({
                        url:"pay",
                        type:"POST",
                        contentType: 'application/json',
                        data:JSON.stringify(data),
                        success:function(res){
                            window.location.href = "prepay/wx/js?transactionId="+res.result.transactionId;
                           // window.location.href = "prepay/qrcode/pay?transactionId="+res.result.transactionId;
                        },
                        error:function(res){
                            alert("支付失败"+res.message);
                        }
                    })
                }else{
                    alert("请输入姓名")
                }

            })
        })
    </script>



</section>
</body>
</html>